<template>

    <tig-form :action="action">
        <default-field field-name="title">
            <template slot="label">
                标题（可选）
            </template>
            <template slot="field">
                <input title="标题" name="title" class="w-full form-control form-input form-input-bordered"
                       :value="title"/>
            </template>
        </default-field>
        <default-field field-name="content">
            <template slot="label">
                内容
            </template>
            <template slot="field">
                <textarea name="content"
                          v-model.trim="chapterContent"
                          class="w-full form-control form-input form-input-bordered py-3 min-h-textarea"></textarea>
                <div role="button" class="btn btn-default btn-white btn-block btn-outline" @click="format">格式化</div>
            </template>
        </default-field>
        <default-field field-name="type">
            <template slot="label">
                内容类型
            </template>
            <template slot="field">
                <input class="mr-1 leading-tight" type="radio" name="type" value="0" :checked="type===0?'checked':''">
                <span class="text-sm">
        普通模式
      </span>
                <input class="mr-1 leading-tight" type="radio" name="type" value="1" :checked="type===1?'checked':''">
                <span class="text-sm">
        Markdown
      </span>
            </template>
        </default-field>
        <default-field field-name="sequence">
            <template slot="label">章节序号</template>


            <template slot="field">
                <input title="章节序号" type="number" name="sequence"
                       class="w-full form-control form-input form-input-bordered" :value="sequence"/>
                <help-text>根据上一章的序号或更新章节的序号自动为您生成。<br>如果作品没有章节，序号可设置为1。<br>若填写了其它序号，如序号已存在，则该章节将被覆盖，但仍可以还原到先前的版本；如序号不存在，则新生成一个章节。
                </help-text>

            </template>
        </default-field>
        <default-field>

            <template slot="field">
                <input type="submit" class="btn btn-default btn-primary cursor-pointer" :value="submitButtonText">
            </template>


        </default-field>

    </tig-form>
</template>

<script>

    export default {
        name: "ChapterForm",
        data: function () {
            return {
                chapterContent: null,
            }
        }, methods: {
            format: function () {

                let chapterContent = this.chapterContent;

                chapterContent = chapterContent
                    .replace(/\n/g, "-----paragraph----")
                    .replace(/-----paragraph----\s+/g, "")
                    .replace(/(-----paragraph----)+/g, "\n\n");

                this.chapterContent = chapterContent;
            }
        },
        props: {
            action: {type: String, required: true},
            title: String,
            sequence: {type: Number, required: true, default: 1},
            content: String,
            type: {type: Number, default: 0},
            submitButtonText: {type: String, default: '创建'},
            isUpdate: {type: Boolean, default: false}
        }, mounted: function () {
            this.chapterContent = this.content;
        }
    }
</script>
